import styled from 'styled-components';
import React, { CSSProperties, useState, useEffect } from 'react';

import { MetaDataDomainObjectsPanel } from './domain-objects-panel';
import { MetaDataDomainInforPanel } from './domain-infor-panel';
import { MetaDataDomainRelationsPanel } from './domain-relations-panel';
import { MetaDataDomainTraitsPanel } from './domain-traits-panel';
import { MetaDataSharePanel } from './share-panel';
import { MetaDataExportPanel } from './export-panel';
import { MetaDataImportPanel } from './import-panel';
import { DataCrudTable } from '@/components/crud';
import { CLASS_CLASS_IDENTIFIER, DOMAIN_CLASS_IDENTIFIER } from '@/services/constants';
import { ComparsionOperator } from '@/services/local';

export type MainMetaDataDomainAction = '对象' | '关系' | '特性' | '导入' | '导出' | '编辑' | string;

export interface MainMetaDataDomainPanelProps {
    style?: CSSProperties;
    action: MainMetaDataDomainAction;
    domainIdentifier: string;
    onDomainChange?: (domainIdentifier: string) => Promise<void>;
}

export const MainMetaDataDomainPanel: React.FC<MainMetaDataDomainPanelProps> = (props) => {

    if (props.action === '对象1') {
        return <DataCrudTable
            classIdentifier={CLASS_CLASS_IDENTIFIER}
            conditions={{
                relations: [{
                    conditions: {
                        identifier: DOMAIN_CLASS_IDENTIFIER,
                        direction: 'reverse'
                    },
                    class_conditions: {
                        attributes: [{
                            name: 'identifier',
                            operator: ComparsionOperator.Equal,
                            value: props.domainIdentifier
                        }]
                    }
                }],
            }}
            excludes={['g01_domain', 'identifier', 'icon', 'comment', 'options', 'description', 'created_at', 'updated_at']}
            create={{
                excludes: ['g01_domain', 'identifier', 'comment', 'created_at', 'updated_at']
            }}
            update={{
                excludes: ['g01_domain', 'identifier', 'comment', 'created_at', 'updated_at']
            }}
            onChange={async () => {
                props.onDomainChange && await props.onDomainChange(props.domainIdentifier)
            }}
        ></DataCrudTable >

    } else if (props.action === '对象') {
        return <MetaDataDomainObjectsPanel style={props.style} domainIdentifier={props.domainIdentifier} onDomainChange={props.onDomainChange} ></MetaDataDomainObjectsPanel>;
    } else if (props.action === '编辑') {
        return <MetaDataDomainInforPanel style={props.style} domainIdentifier={props.domainIdentifier} onDomainChange={props.onDomainChange} ></MetaDataDomainInforPanel>;
    } else if (props.action === '关系') {
        return <MetaDataDomainRelationsPanel style={props.style} domainIdentifier={props.domainIdentifier} onDomainChange={props.onDomainChange} ></MetaDataDomainRelationsPanel>;
    } else if (props.action === '特性') {
        return <MetaDataDomainTraitsPanel style={props.style} domainIdentifier={props.domainIdentifier} onDomainChange={props.onDomainChange} ></MetaDataDomainTraitsPanel>
    } else if (props.action === '分享') {
        return <MetaDataSharePanel style={props.style} domainIdentifier={props.domainIdentifier} ></MetaDataSharePanel>
    } else if (props.action === '导出') {
        return <MetaDataExportPanel style={props.style} domainIdentifier={props.domainIdentifier} ></MetaDataExportPanel>
    } else if (props.action === '导入') {
        return <MetaDataImportPanel style={props.style} domainIdentifier={props.domainIdentifier} onDomainChange={props.onDomainChange} ></MetaDataImportPanel>
    }
    return (
        <>
        </>
    );
}
